import React, { Component } from 'react'
import moment from 'moment'
// 使用中文: 估摸着是webpack打包时没把中文打进去
import 'moment/locale/zh-cn'
// moment.locale('zh-cn')
import { connect } from 'react-redux'
import actionCreator from '@/store/actionCreator'
// import { allArticleReq } from '@/utils/request'
// import { ALLBLOGCHANGE } from '@/store/actionType'
import { Tabs } from 'antd';
import One from './articles/one'
const { TabPane } = Tabs;

const mapStateToProps = (state, ownProps) => {
  let list = state.getIn(['blog', 'allArticles'])
  // console.log(list)

  list = list.map(item => {
    // const secondTime = moment(new Date()).diff(item.time, 'ms')
    let formatTime = moment(item.time).fromNow()
    // if (secondTime < 600000) {
    //   formatTime = moment(item.time).startOf('minute').fromNow()
    // } else if (secondTime < 3600000) {
    //   // 1小时
    //   formatTime = moment(item.time).startOf('hour').fromNow()
    // } else if (secondTime < 3600000 * 24 * 15) {
    //   // 1天
    //   formatTime = moment(item.time).startOf('day').fromNow()
    // }
    // else {
    //   formatTime = moment(item.time).format('llll')
    // }
    return { ...item, formatTime }
  })
  // 过滤并排序
  const pubList = list.filter(item => {
    return item.author === sessionStorage.getItem('email') && item.isPub === true
  }).sort((a, b) => b.time - a.time)
  const draftList = list.filter(item => {
    return item.author === sessionStorage.getItem('email') && item.isPub === false
  }).sort((a, b) => b.time - a.time)
  // 返回值
  return {
    pubList,
    draftList
  }
}
const mapDispatchToProps = {
  // promise中间件
  getAllArticle: actionCreator.getAllArticle,
  setBreadList: actionCreator.setBreadList
}
@connect(mapStateToProps, mapDispatchToProps)
class Articles extends Component {
  componentDidMount() {
    this.props.setBreadList(['发布文章', '文章管理'])
    this.props.getAllArticle()
  }

  render() {
    const { pubList, draftList } = this.props
    return (
      <div>
        <div className="card-container">
          <Tabs tabBarStyle={{ borderBottom: '1px solid #bbb' }}>
            <TabPane tab="已发布" key="1">
              <One List={pubList} />
            </TabPane>
            <TabPane tab="草稿箱" key="2">
              <One List={draftList} />
            </TabPane>
          </Tabs>
        </div>
      </div>
    )
  }
}

export default Articles
